<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      // 题目1
      //     console.log(1)
      //     setTimeout(() => {
      //       console.log(2)
      //     }, 2000)
      //     setTimeout(() => {
      //       console.log(3)
      //     }, 1000)
      //     console.log(4)
      //   1 4 3 2

      // 题目2
      //     console.log(1)
      //     setTimeout(() => {
      //       console.log(2)
      //     }, 0)
      //     setTimeout(() => {
      //       console.log(3)
      //     }, 0)
      //     console.log(4)
      //   1 4 2 3

      // 题目3
      //   setTimeout(() => {
      //     console.log(1)
      //   }, 0)
      //   new Promise((resolve, reject) => {
      //     console.log(2)
      //     resolve(3)
      //   }).then((res) => {
      //     console.log(res)
      //   })
      //   console.log(4)
      // 2 4 3 1
      // 同步、异步（宏任务、微任务）
      // 宏任务：setTimeout、setInterval
      // 微任务：promise(.then)
      // 事件循环（eventLoop）
      //   一个宏任务，所有微任务执行=>一个宏任务，所有微任务
      // 题目4
      console.log(1)
      setTimeout(function () {
        console.log(2)
        new Promise(function (resolve) {
          console.log(3)
          resolve()
        }).then(function () {
          console.log(4)
        })
      })
      const p = new Promise((resolve, reject) => {
        console.log(5)
        resolve() // 标记为成功
        console.log(6)
      })

      p.then((data) => {
        console.log(7)
      })

      console.log(8)
      // 1 5 6 8 7 2 3 4
    </script>
  </body>
</html>
